<script setup lang="ts" name="DialogCommon">
interface Props {
  title: string,
  width?: string
}
const props = withDefaults(defineProps<Props>(), {
  title: '弹框标题',
  width: '500',
});
const dialogVisible = defineModel();

const emit = defineEmits(['confirm'])
const handleConfirm = () => {
  dialogVisible.value = false;
  emit('confirm');
}
</script>

<template>
  <el-dialog append-to-body v-model="dialogVisible" :title="props.title" :width="props.width" class="dialog-common">
    <slot></slot>
    <template #footer>
      <slot name="footer" v-if="$slots.footer"></slot>
      <div class="dialog-footer" v-else>
        <el-button class="default" @click="dialogVisible = false">取消</el-button>
        <el-button type="primary" @click="handleConfirm">确定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<style scoped lang="scss"></style>
